<!DOCTYPE html>
<html class="x-admin-sm">
    <head>
        {include file="public/static" /}
    </head>
    <body>
        <div class="layui-fluid">
            <div class="layui-row">
                <form class="layui-form">
                    <input type="hidden" name="id" value="{$info.ca_id}">
                    <div class="layui-form-item">
                        <label for="name" class="layui-form-label">
                            <span class="x-red">*</span>标题
                        </label>
                        <div class="layui-input-inline">
                            <input type="text" id="title" name="title" value="{$info.ca_title}" lay-verify="title"
                            autocomplete="off" class="layui-input">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label for="upload" class="layui-form-label">
                            <span class="x-red">*</span>图片
                        </label>
                        <div class="layui-input-inline">
                            <div class="layui-upload">
                                <span style="width:14.8rem;" class="layui-badge" >比例4:3，大小{$webInfo.sy_photoMaxSize}M</span>
                                <input type="hidden" lay-verify="image" id="image" name="image" value="{$info.ca_image}">
                                <input type="hidden" lay-verify="oldImage" id="oldImage" name="oldImage" value="{$info.ca_image}">
                                <button style="width: 100%" type="button" id="photo" class="layui-btn">
                                    <i class="layui-icon">&#xe67c;</i>选择图片
                                </button>
                                <div class="layui-upload-list">
									<div id="demo">
										<img style="width: 100%" src="__upload__/{$info.ca_image}" class="layui-upload-img">
									</div>
                                </div>
                            </div>
                        </div>
                    </div>

                  <div class="layui-form-item">
                      <label for="name" class="layui-form-label">
                          <span class="x-red">*</span>链接地址
                      </label>
                      <div class="layui-input-inline">
                          <input type="text" id="url" name="url" value="{$info.ca_url}" lay-verify="required"
                          autocomplete="off" class="layui-input">
                      </div>
                  </div>
                  <div class="layui-form-item">
                      <label for="name" class="layui-form-label">
                          <span class="x-red">*</span>排序
                      </label>
                      <div class="layui-input-inline">
                          <span style="width:14.8rem;" class="layui-badge" >数值越低优先级越高</span>
                          <input type="number" id="sort" name="sort" value="{$info.ca_sort}" lay-verify="sort"
                          autocomplete="off" class="layui-input">
                      </div>
                  </div>
                    <div class="layui-form-item">
                      <label for="name" class="layui-form-label">
                          <span class="x-red">*</span>状态
                      </label>
                      <div class="layui-inline">
                          <select name="status" id="status">
                              <option value="1" {eq name="info.ca_status" value="1"} selected {/eq}>启用</option>
                              <option value="0" {eq name="info.ca_status" value="0"} selected {/eq}>禁用</option>
                          </select>
                      </div>
                  </div>
                  <div class="layui-form-item">
                      <label for="L_repass" class="layui-form-label">
                      </label>
                      <button class="layui-btn" lay-filter="add" lay-submit="">提交</button>
                  </div>
              </form>
            </div>
        </div>
        <script>
            //上传
            var data = [
                {"id":"#photo", "preview":"#demo", "val":"#image", "url":"{:url('Carousel/carouselUpload')}"}
            ];
            common.uploadFile(data);
            //提交数据
            layui.use(['form', 'layer'], function() {
                $ = layui.jquery;
                var form = layui.form,
                layer = layui.layer;
                //自定义验证规则
                form.verify({
                    //标题
                    title: function(value) {
                        if (value.length < 2) {
                            return '标题不能小于2个字';
                        }
                        if(/^\d+\d$/.test(value)){
                            return '标题不能全为数字';
                        }
                        if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                            return '标题不能有特殊字符';
                        }
                    },
                    image:function (value) {
                        if (value.length < 1) {
                            return '图片不能为空';
                        }
                    },
                    sort:function (value) {
                        if(!value.replace(/\D/g,'')){
                            return '排序必须为整数，且不能0开头';
                        }
                    }
                });
                //监听提交
                form.on('submit(add)', function(data) {
                    var index = layer.load();
                    //发异步，把数据提交给php
                    $.ajax({
                        type:"post",
                        url:"{:url('Carousel/carouselEdit')}",
                        data: data.field,
                        dataType: 'json',
                        success:function (data) {
                            if(data.status === 1){
                                layer.msg(data.info, {icon: 6,time:1500}, function() {
                                    /*关闭弹出层并刷新*/
                                    common.closeWindowReload();
                                });
                            }else{
                                layer.msg(data.info, {icon: 5,time:1500});
                            }
                            layer.close(index);
                        },
                        error:function (data) {
                            console.log(data);
                            layer.msg("不好意思，出现了一点问题", {icon: 5});
                        }
                    });
                    //必须加上return false，不然无法关闭iframe
                    return false;
                });
            });
        </script>
    </body>
</html>
